<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <link href="assets/css/bootstrap.min.css" rel="stylesheet" />
  <link rel="stylesheet" href="assets/css/font-awesome.min.css" />
  <!--[if IE 7]>
    <link rel="stylesheet" href="assets/css/font-awesome-ie7.min.css" />
  <![endif]-->
  <!--<link rel="stylesheet" href="http://fonts.useso.com/css?family=Open+Sans:400,300" />-->
  <link rel="stylesheet" href="assets/css/ace.min.css" />
  <link rel="stylesheet" href="css/style.css"/>
    <link href="css/jquery.searchableSelect.css" rel="stylesheet" type="text/css">
    <script src="js/jquery-1.11.1.min.js"></script>
    <script src="js/jquery.searchableSelect.js"></script>
<title>条款列表</title>
<style type="text/css">
    #model14{
        text-align:center;
    }
    ul.pagination {
        display: inline-block;
        padding: 0;
        margin: 0;
    }

    ul.pagination li {display: inline;}

    ul.pagination li a {
        color: black;
        float: left;
        padding: 8px 16px;
        text-decoration: none;
        transition: background-color .3s;
        border: 1px solid #ddd;
        margin: 0 4px;
    }

    ul.pagination li a.active {
        background-color: #ff9d94;
        color: white;
        border: 1px solid #ff9d94;
    }
</style>
</head>
<body>
<div class="page-content">
<!--条款列表样式-->
<div class="d_Confirm_Order_style">
 <div class="row">
   <div class="col-xs-12">
	<h3 class="header smaller lighter blue">条款列表</h3>
	<div class="table-header"></div>
    <div class="search_style">
      <div class="title_names">搜索查询</div>
        <form action="/clause" method="post">
      <ul class="search_content clearfix">
       <li style="width: 500px;"><label class="lf">选择法规：</label>
           <input type="hidden" id="lawsNum" th:value="${lawsId}">
           <select style="margin-left: 10px;" name="lawsId" id="xialakuang">
           <option value="0">---请选择---</option>
               <option th:each="laws:${laws}" th:text="${laws.lawsName}" th:value="${laws.id}"></option></select></li>
          <script>
              $(function () {
                  var num=$('#lawsNum').val();
                  document.getElementById("xialakuang").options[num].selected = true;
                  $('select').searchableSelect();
              })
          </script>
       <li><label class="lf" style="margin-left: 50px">条款号：</label><input name="clauseId" type="text"  class="text_add" th:value="${clauseId}"/></li>
       <li><label class="lf" style="margin-left: 50px">关键词：</label><input name="keyword" class="text_add" type="text" th:value="${keyword}"></li>
       <li style="width:90px;margin-left: 50px"><button id="btn_search" type="submit" class="btn_search">查询</button></li>
      </ul>
        </form>
    </div>
	<div class="table-responsive">
	  <table id="sample-table-2" class="table table-striped table-bordered table-hover"  >
		<thead>
         <tr>
		  <th>条款号</th>
		  <th>条款别名</th>
		  <th>条款标题</th>
          <th>所属法规名称</th>
		  <th>版本号</th>
          <th>操作</th>
         </tr>
		</thead>
         <tbody th:each="list:${pageInfo.list}">
             <tr>
                 <td th:text="${list.clauseId}"></td>
                 <td th:text="${list.clauseAlias}"></td>
                 <td th:text="${list.clauseTitle}"></td>
                 <td th:each="laws:${laws}" th:if="${laws.id} eq ${list.lawsId}" th:text="${laws.lawsName}"></td>
                 <td th:text="${list.clauseNum}"></td>
                 <td><a th:href="@{/doUpdate(id=${list.getId()})}">修改</a>&nbsp;&nbsp;&nbsp;<a th:href="@{'/delClause?cid='+${list.id}}">删除</a></td>
             </tr>
         </tbody>
  </table>
      <!--  <div class="page_style">
            <a th:href="@{/clause(pageNum=${pageInfo.firstPage})}">首页</a>&nbsp;&nbsp;
            <a th:if="${pageInfo.hasPreviousPage}" th:href="@{/clause(pageNum=${pageInfo.prePage})}">上一页</a>&nbsp;&nbsp;
            <span th:each="i:${pageInfo.navigatepageNums}">
        <span style="background-color:cyan" th:if="${pageInfo.pageNum==i}" th:text="${i}"></span>
        <a th:if="${pageInfo.pageNum!=i}" th:text="${i}" th:href="@{/clause(pageNum=${i})}"></a>&nbsp;&nbsp;&nbsp;
    </span>
            <a th:if="${pageInfo.hasNextPage}" th:href="@{/clause(pageNum=${pageInfo.nextPage})}">下一页</a>&nbsp;&nbsp;&nbsp;
            <a th:href="@{/clause(pageNum=${pageInfo.lastPage})}">尾页</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
            <span th:text="'第'+${pageInfo.pageNum}+'页/共'+${pageInfo.pages}+'页,共'+${pageInfo.total}+'条记录'"></span>
        </div>-->

        <div id="model14" style="margin-left: 25%">
            <div>
                <ul class="pagination" style="width: 1000px" th:align="center">
                    <li><a th:href="@{/clause(pageNum=${pageInfo.firstPage})}" style="width: 60px;height: 38px;border: 1px solid #DDDDDD;">首页</a></li>
                    <li><a th:href="@{/clause(pageNum=${pageInfo.prePage})}" th:if="${pageInfo.hasPreviousPage}" style="width: 90px;height: 38px;border: 1px solid #DDDDDD" th:text="${pageInfo.hasPreviousPage}?'上一页'" ></a></li>
                    <div th:each="i:${pageInfo.navigatepageNums}">
                        <li><a th:href="@{/clause(pageNum=${i})}" class="active" th:text="${i==pageInfo.pageNum}?${i}"  th:if="${i==pageInfo.pageNum}">${i}</a></li>
                        <li><a th:href="@{/clause(pageNum=${i})}" th:text="${i!=pageInfo.pageNum}?${i}" th:if="${i!=pageInfo.pageNum}">${i}</a></li>
                    </div>
                    <li><a th:href="@{/clause(pageNum=${pageInfo.nextPage})}" th:if="${pageInfo.hasNextPage}" style="width: 90px;height: 38px;border: 1px solid #DDDDDD" th:text="${pageInfo.hasNextPage}?'下一页'" ></a></li>
                    <li><a th:href="@{/clause(pageNum=${pageInfo.lastPage})}" style="width: 60px;height: 38px;border: 1px solid #DDDDDD">末页</a></li>
                </ul>
            </div>
        </div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
